<template>
  <view class="normal-login-container">
    <view class="search-wrap">

      <view style="flex: 1;margin-right: 20rpx">
        <uni-datetime-picker v-model="range" type="daterange" @change="timeChange"/>
      </view>
	  <uni-icons type="plus-filled" color="#1890FF" size="30" @click="goAdd" v-if="checkPermi(['memberClue:clueList:add'])" />
     <!-- <uni-tag :inverted="false"  text="新增" type="primary" @click="goAdd"></uni-tag> -->
    </view>

    <mescroll-body @init="mescrollInit" @down="downCallback" @up="upCallback">
      <view class="item-wrap" v-for="(item,index) in list" :key="index" @click="goDetail(item)">

        <view class="title-wrap lineBottom10">
          <text>{{ item.lastFollowTime }}</text>
          <dict-tag
            :options="dict.type.business_scope"
            show-tag
            :value="item.businessScopeCode"/>
        </view>

        <view class="text-line">
          <text class="text-name">客户名称:</text>
          <text class="text-value">{{ item.customerName|filterNull }}</text>
        </view>
        <view class="text-line">
          <text class="text-name">意向情况:</text>
          <dict-tag
            :options="dict.type.clues_intention"
            :value="item.cluesIntentionCode"/>
        </view>
        <view class="text-line">
          <text class="text-name">跟进人:</text>
          <text class="text-value">{{ item.followerNames|filterNull }}</text>
        </view>

        <view class="btn-wrap lineTop20">

            <button v-if="checkPermi(['memberClue:clueList:transfer'])" size="mini" type="primary" @click.stop="goTransfer(item)">转移</button>

            <button v-if="checkPermi(['memberClue:clueList:follow'])" size="mini" type="primary" @click.stop="goFollow(item)">跟进</button>

        </view>

      </view>
    </mescroll-body>

  </view>
</template>

<script>
import {cluesDelete, cluesList, cluesTransferRecordAdd} from "@/api/memberManage/clueList";

export default {
  dicts: ["business_scope", "clues_intention"],
  data() {
    return {
      list: [],
      range: []
    }
  },
  onLoad() {
    uni.$on('refreshClue', call=>{
      this.mescroll.triggerDownScroll();
    })
  },
  methods: {
    upCallback(page) {
      var params = {
        startTime: (this.range && this.range.length > 1) ? this.range[0] : null,
        endTime: (this.range && this.range.length > 1) ? this.range[1] : null,
        pageNum: page.num,
        pageSize: page.size,
      }
      cluesList(params).then(res => {
        //设置列表数据
        if (page.num == 1) this.list = []; //如果是第一页需手动制空列表
        this.list = this.list.concat(res.rows); //追加新数据
        this.mescroll.endBySize(res.rows.length, res.total);
      }).catch(() => {
        //联网失败, 结束加载
        this.mescroll.endErr();
      })
    },
    //搜索
    timeChange(value) {
      this.range = value
      this.mescroll.triggerDownScroll();
    },
    goAdd() {
      this.$tab.navigateTo('/pages/CluePage/clue/add?state=write')
    },
    goDetail(clue) {
      this.$tab.navigateTo('/pages/CluePage/clue/add?state=detail&cluesId='+clue.cluesId)
    },
    goTransfer(clue) {
      this.$tab.navigateTo('/pages/CluePage/clue/transfer?cluesId='+clue.cluesId)
    },
    goFollow(clue) {
      this.$tab.navigateTo('/pages/CluePage/clue/follow?cluesId='+clue.cluesId)
    },
  }
}
</script>

<style lang="scss" scoped>

/deep/ .uni-date__x-input{
  font-size: 24rpx;
  height: 60rpx;
  line-height: 60rpx;
}
/deep/ .uni-date-x .range-separator {
  height: 60rpx;
  line-height: 60rpx;
}

</style>
